import { PageContainer } from '@ant-design/pro-components';
import { history } from '@umijs/max';
import { Button, Card, Image } from 'antd';
import React from 'react';
import './Welcome.less';

const Welcome: React.FC = () => {
  return (
    <PageContainer>
      <div
        className={'mainBox'}
        style={{
          overflow: 'hidden',
        }}
      >
        <div
          className={'imgBox'}
          style={{
            float: 'left',
            overflow: 'hidden',
            width: '75%',
          }}
        >
          <Image
            src={'https://xiaoxiaobaiyang.oss-cn-shenzhen.aliyuncs.com/src_img/welcome3.png'}
          ></Image>
        </div>
        <Card
          className={'enterBox'}
          style={{
            width: '25%',
            height: '570px',
            float: 'right',
            borderRadius: '0px',
          }}
        >
          <Image
            src={'https://xiaoxiaobaiyang.oss-cn-shenzhen.aliyuncs.com/src_img/logo1.png'}
            style={{
              marginLeft: '50px',
            }}
          ></Image>

          <div
            style={{
              display: 'flex',
              flexDirection: 'column',
              justifyContent: 'center',
              alignItems: 'center',
            }}
          >
            <Button
              className={'userButton'}
              type={'primary'}
              onClick={() => {
                history.push('user/login');
              }}
            >
              {' '}
              用户登录{' '}
            </Button>
            <Button
              className={'userButton'}
              type={'primary'}
              ghost
              onClick={() => {
                history.push('user/register');
              }}
            >
              {' '}
              用户注册{' '}
            </Button>
          </div>
        </Card>
      </div>
    </PageContainer>
  );
};

export default Welcome;
